<#import '/ftlLibrary/properteisVariable.ftl' as pv/>
<link href="assets/css/bootstrap-select.css" rel="stylesheet"/>
<link href="assets/css/front/listCommonStyle.css" rel="stylesheet"/>
<script src="assets/js/select2/select2.js"></script>
<style>
    td, th {
        height: 34.29px !important;
    }

    .tssStudentModal .modal-dialog {
        width: 60%;
    }

    input {
        height: 30px !important;
    }

    .editFormDiv label {
        margin: 0 auto !important;
    }

    .editFormDiv .control-label {
        text-align: right;
        line-height: 25px;
    }
    .labelBorderTable label{
        margin:0;
        padding:0;
    }
</style>
<div class="row" style="margin-left: 0px!important;">
    <div class="col-xs-6 col-xs-offset-3">
        <div class="col-xs-4 nopadding">
            <button type="btn" class="btn col-xs-12 " onclick="detailsSwitch(this)" flag="1" style="border-color: #5db2ff!important;float:left">费用明细</button>
        </div>
        <div class="col-xs-4 nopadding">
            <button type="btn" class="btn col-xs-12 " onclick="detailsSwitch(this)" flag="2" style="border-color: #5db2ff!important;float:left">缴费记录</button>
        </div>
        <div class="col-xs-4 nopadding">
            <button type="btn" class="btn col-xs-12 " onclick="detailsSwitch(this)" flag="3" style="border-color: #5db2ff!important;background-color: #5db2ff;float:left">退款记录</button>
        </div>
    </div>
    <!-- 映射列表 -->
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 labelBorderTable" style="margin-top: 15px">
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-bottom: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0;">
                会员编号：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.number???string(viewStudentDetails.number?html,"未设置"))!'未设置'}
            </label>
        </label>
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-left: none;border-bottom: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                客户姓名：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.name???string(viewStudentDetails.name?html,"未设置"))!'未设置'}
            </label>
        </label>
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-left: none;border-bottom: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                会员性别：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.sex???string(viewStudentDetails.sex?html,"未设置"))!'未设置'}
            </label>
        </label>

        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                联系电话：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.contactPhone???string(viewStudentDetails.contactPhone?html,"未设置"))!'未设置'}
            </label>
        </label>
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-left: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                会员类型：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.type???string(viewStudentDetails.type?html,"未设置"))!'未设置'}
            </label>
        </label>
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-left: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                所属顾问：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.realName???string(viewStudentDetails.realName?html,"未设置"))!'未设置'}
            </label>
        </label>

        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-top: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                缴费总额：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.sumAmount???string(viewStudentDetails.sumAmount?html,"未设置"))!'未设置'}
            </label>
        </label>
        <label class="col-xs-4 text-align-center" style="border: 1px solid #ccc;border-left: none;border-top: none">
            <label class="col-xs-6" style="border-right: 1px solid #ccc;padding: 5px 0">
                退费4E总额：
            </label>
            <label class="col-xs-6" style="padding: 5px 0">
                ${(viewStudentDetails.refundAmout???string(viewStudentDetails.refundAmout?html,"未设置"))!'未设置'}
            </label>
        </label>
    </div>
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 margin-top-20" style="height: 34.29px;line-height: 34.29px;background-color: #eee;padding: 0px 10px;border: 1px solid #ccc;border-bottom: none">
            <label class="pull-right" style="color: red">
                累计退费：100000.00元
            </label>
        </div>
    </div>
    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="widget flat radius-bordered" style="margin-top: 0;box-shadow:0px 0px 10px rgba(122,161,184,0.3);!important;">
            <div class="widget-body no-padding ">
                <div class="topPagingBar hidden">
                    <form>
                        <input type="hidden" name="checkboxId" id="checkboxId" value="0">
                        <input type="hidden" name="stuId" id="stuId" value="${stuId}">
                    </form>
                </div>
                <div class="table-scrollable">
                    <!-- 数据表列信息列表 -->
                    <table class="table table-bordered dataTable">
                        <thead>
                        <tr>
                            <th title="属性名">序号</th>
                            <th title="费用类型">费用类型</th>
                            <th title="费用明细">费用明细</th>
                            <th title="报名状态">报名状态</th>
                            <th title="费用金额(元)">费用金额(元)</th>
                            <th title="发起时间">发起时间</th>
                            <th title="退款时间">退款时间</th>
                            <th title="退费金额(元)">退费金额(元)</th>
                            <th title="退款编码">退款编码</th>
                            <th title="操作人">操作人</th>
                            <th title="操作时间">退款状态</th>
                            <th title="操作详情">操作详情</th>
                        </tr>
                        </thead>
                        <tbody>
                        <#if viewRefundDetailsList?size==0>
                            <tr>
                                <td align="center">无数据</td>
                            </tr>
                        </#if>
                        <#list viewRefundDetailsList as data>
                            <tr>
                                <td>2</td>
                                <td>${(data.paymentType???string(data.paymentType?html,"未设置"))!'未设置'}</td>
                                <td>${(data.packageName???string(data.packageName?html,"未设置"))!'未设置'}</td>
                                <td>-</td>
                                <td>${(data.sumPrice???string(data.sumPrice?html,"未设置"))!'未设置'}</td>
                                <td>${(data.createTime???string(data.createTime?html,"未设置"))!'未设置'}</td>
                                <td>${(data.updateTime???string(data.updateTime?html,"未设置"))!'未设置'}</td>
                                <td>${(data.amout???string(data.amout?html,"未设置"))!'未设置'}</td>
                                <td>${(data.refundCode???string(data.refundCode?html,"未设置"))!'未设置'}</td>
                                <td>${(data.userName???string(data.userName?html,"未设置"))!'未设置'}</td>
                                <td>${(data.refundStatus???string(data.refundStatus?html,"未设置"))!'未设置'}</td>
                                <td><a href="javascript:void(0);" onclick="details(this)" refundId=${data.id}>查看</a></td>
                            </tr>
                        </#list>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>


    </div>
</div>
<script>
    $(".selectpicker").select2();


    function detailsSwitch(that) {
        var flag = $(that).attr("flag");
        var stuId = $("#stuId").val();
        var htmlTitle= "";
        var url = "";
        if(flag == "1"){
            htmlTitle= "费用明细";
            url="tssPaymentController/chargeDetails.do";
        }
        if(flag == "2"){
            htmlTitle= "缴费记录";
            url="tssPaymentController/ViewPaymentDetails.do";
        }
        if(flag == "3"){
            htmlTitle= "退费记录";
            url="tssMemberReturnPremiumController/ViewRefundDetails.do";
        }
        console.log(url);
        bootbox.hideAll();
        ajaxRequest(url, {
            stuId:stuId
        }, function (html) {
            getTopWin().bootbox.dialog({
                message: html,
                title: htmlTitle,
                className: 'myDialog tssStudentModal'
            });
            $(".modal-header").find(".bootbox-close-button").removeClass("close");
            $(".modal-header").find(".bootbox-close-button").html("");
        }, function () {
            ajaxError("加载页面失败!")
        }, "get", "html")
    }


    function details(that) {
        var refundId = $(that).attr("refundId");
        var stuId = $("#stuId").val();
        ajaxRequest("tssMemberReturnPremiumController/approvalDetails.do", {
            refundId:refundId,
            stuId:stuId
        }, function (html) {
            getTopWin().bootbox.dialog({
                message: html,
                title: "退费详情",
                className: 'myDialog familyMemberDialog',
            });
            $(".modal-header").find(".bootbox-close-button").removeClass("close");
            $(".modal-header").find(".bootbox-close-button").html("");
        }, function () {
            ajaxError("加载页面失败!")
        }, "get", "html")

    }
</script>